<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/taglib.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
	<meta http-equiv="pragma" content="no-cache" />
	<meta http-equiv="cache-control" content="no-cache" />
	<meta http-equiv="expires" content="0"/>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
	<title>MCU Manager</title>
	<%@ include file="/WEB-INF/jsp/common/cssjs2.jsp" %>	
	<style type="text/css">
	    html, body {
	        width: 100%;
	        height: 100%;
	        margin: 0px;
	        overflow: hidden;
	    }
	</style>
	
	<script type="text/javascript">
	<%@ include file="/javascript/app/main.js" %>
	</script>

</head>
<body>
<%-- app header --%>
<div id="id_header" class="header">
	<div id="id_menu" class="menu"></div>
	<div id="id_header_right" class="right">
		<label id="lab_mcu_datetime"></label> | 
		<fmt:message key='menu.right.label.user'/>:${sessionScope.loginInfo.username} | 
		<fmt:message key='menu.right.label.mcu'/>:${sessionScope.loginInfo.mcuName} | 
		<fmt:message key='menu.right.label.ip'/>:${sessionScope.loginInfo.mcuIP} | 
        <img onclick="location.href='<c:url value='/app/manage/main' />'" align="absmiddle" style="cursor: pointer;" src="<c:url value='/styles/default/images/home.png' />" title="<fmt:message key='home'/>" />
        &nbsp;|&nbsp; 
        <img onclick="openWin('<fmt:message key='mcu.version.title'/>', '<c:url value='/app/view/mcu/version'/>', 300, 300);" align="absmiddle" style="cursor: pointer;" src="<c:url value='/styles/default/images/version.png'/>" title="<fmt:message key='banner.about'/>"/>
        &nbsp;|&nbsp; 
        <img onclick="location.href='<c:url value='/app/perm/logout'/>';" align="absmiddle" style="cursor: pointer;" src="<c:url value='/styles/default/images/logout.png'/>" title="<fmt:message key='banner.logout'/>" />
	</div>
	<div style="clear:both;"></div>
</div>
<%-- following divs are for conference control module --%>
<%-- conference layout  --%>
<div id="id_layout" style="display:none;margin: 5px;">
	<table border="0" style="text-align:left;font-size:12px;">
		<tr>
			<td>
			<fmt:message key="form.confControl.pollTime"/>
			<input type="text" name="pollTime"/>
			<button onclick="confCtrlViewObj.saveLayout();" class="mybtn"><fmt:message key='btn.customLayout'/></button>
			<button onclick="confCtrlViewObj.autoLayout();" class="mybtn"><fmt:message key='btn.automatic'/></button>
			</td>
		</tr>
		<tr>
			<td>
				<input name="layoutStyle" type="radio" value="1"><img src="<c:url value='/styles/default/images/fp_1.gif'/>" align="absbottom" alt="1">
	            <input name="layoutStyle" type="radio" value="2"><img src="<c:url value='/styles/default/images/fp_2.gif'/>" align="absbottom" alt="2">
	            <input name="layoutStyle" type="radio" value="3"><img src="<c:url value='/styles/default/images/fp_3.gif'/>" align="absbottom" alt="3">
	            <input name="layoutStyle" type="radio" value="4"><img src="<c:url value='/styles/default/images/fp_4.gif'/>" align="absbottom" alt="4">
	            <input name="layoutStyle" type="radio" value="5"><img src="<c:url value='/styles/default/images/fp_5b.gif'/>" align="absbottom" alt="5">
	            <input name="layoutStyle" type="radio" value="6"><img src="<c:url value='/styles/default/images/fp_6.gif'/>" align="absbottom" alt="6">
	            <input name="layoutStyle" type="radio" value="7"><img src="<c:url value='/styles/default/images/fp_7.gif'/>" align="absbottom" alt="7">
	            <input name="layoutStyle" type="radio" value="8"><img src="<c:url value='/styles/default/images/fp_8.gif'/>" align="absbottom" alt="8">
	            <input name="layoutStyle" type="radio" value="9"><img src="<c:url value='/styles/default/images/fp_9.gif'/>" align="absbottom" alt="9">
	            <input name="layoutStyle" type="radio" value="10"><img src="<c:url value='/styles/default/images/fp_10.gif'/>" align="absbottom" alt="10">
	            <input name="layoutStyle" type="radio" value="13"><img src="<c:url value='/styles/default/images/fp_13.gif'/>" align="absbottom" alt="13">
	            <input name="layoutStyle" type="radio" value="16"><img src="<c:url value='/styles/default/images/fp_16.gif'/>" align="absbottom" alt="16">
			</td>
		</tr>
		<tr>
			<td>
				<div id="layout_1">
				<table width="100%" height="300" border="0" align="center" cellpadding="0" cellspacing="1" class="t">
					<tr>
						<td colspan="5" bgcolor="#ffffff" align="center">
						<select order="1"><%--
							<option value="" callid=""  stype="auto"><fmt:message key="custom.layout.auto"/></option>
							<option value="" callid="" stype="poll"><fmt:message key="custom.layout.poll"/></option>
							<option value="" callid="" stype="speaker"><fmt:message key="custom.layout.speaker"/></option>
						--%></select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_2">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="1">
							<%--<option value="" callid=""  stype="auto"><fmt:message key="custom.layout.auto"/></option>
							<option value="" callid="" stype="poll"><fmt:message key="custom.layout.poll"/></option>
							<option value="" callid="" stype="speaker"><fmt:message key="custom.layout.speaker"/></option>
						--%></select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_3">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td colspan="2" align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
						
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
						
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_4">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
						
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_5">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td colspan="4" align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="5">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_6">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td colspan="2" rowspan="2" align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
						
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="6">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="5">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
						
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_7">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td width="50%" height="50%" colspan="2" align="center" bgcolor="#ffffff">
						<select order="1">
						
						</select>
						</td>
						<td colspan="2" align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
					</tr>
					<tr>
						<td width="50%" colspan="2" rowspan="2" align="center"
							bgcolor="#ffffff">
						<select order="3">
						
						</select>
						</td>
						<td width="25%" align="center" bgcolor="#ffffff">
						<select order="4">
						
						</select>
						</td>
						<td width="25%" align="center" bgcolor="#ffffff">
						<select order="5">
						
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="6">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="7">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_8">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td colspan="3" rowspan="3" align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
							
						</select>
						</td>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
						
						</select>
						</td>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="5">
						
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="6">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="7">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="8">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_9">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
						
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="5">
						
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="6">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="7">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="8">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="9">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_10">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td height="50%" colspan="2" align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
						<td colspan="2" align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
						
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="5">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="6">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="7">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="8">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="9">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="10">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_13">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td height="50%" width="50%" colspan="2" rowspan="2" align="center"
							bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="5">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="6">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="7">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="8">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="9">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="10">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="11">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="12">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="13">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
				<div id="layout_16">
				<table width="100%" height="300" align="center" class="t"
					border="0" cellpadding="0" cellspacing="1">
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="1">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="2">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="3">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="4">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="5">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="6">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="7">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="8">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="9">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="10">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="11">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="12">
							
						</select>
						</td>
					</tr>
					<tr>
						<td align="center" bgcolor="#ffffff">
						<select order="13">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="14">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="15">
							
						</select>
						</td>
						<td align="center" bgcolor="#ffffff">
						<select order="16">
							
						</select>
						</td>
					</tr>
				</table>
				</div>
		</td>
		</tr>
	</table>
</div>
<%-- conference infomation  --%>
<div id="id_info" style="display:none;margin: 5px;">
	<table border="0" cellpadding="5" cellspacing="1">
		<tr>
			<td><fmt:message key="form.confControl.confNumber"/></td>
			<td><span id="id_confNumber"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.confName"/></td>
			<td><span id="id_confName"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.beginTime"/></td>
			<td><span id="id_beginTime"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.audioPorts"/></td>
			<td><span id="id_audioPorts"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.videoPorts"/></td>
			<td><span id="id_videoPorts"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.h239"/></td>
			<td><span id="id_h239"></span></td>
		</tr>
	</table>
</div>
<%-- Send Message  --%>
<div id="id_sendMsg" style="display:none;margin: 5px;">
    <div style="margin: 3px;"><button onclick="confCtrlViewObj.sendMessage();" class="mybtn"><fmt:message key='btn.ok'/></button></div> 
	<table border="0" cellpadding="5" cellspacing="1">
		<tr>
			<td><fmt:message key="form.confControl.message"/></td>
			<td><input type="text" name="message"></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.msgDisplayTime"/></td>
			<td><input type="text" name="msgDisplayTime"></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.msgDisplayPos"/></td>
			<td>
				<input type="radio" name="msgDisplayPos" value="top"><fmt:message key="form.common.top"/>
				<input type="radio" name="msgDisplayPos" value="center"><fmt:message key="form.common.center"/>
				<input type="radio" name="msgDisplayPos" value="bottom"><fmt:message key="form.common.bottom"/>
			</td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.msgFontSize"/></td>
			<td>
				<input type="radio" name="msgFontSize" value="big"><fmt:message key="form.common.big"/>
				<input type="radio" name="msgFontSize" value="middle"><fmt:message key="form.common.middle"/>
				<input type="radio" name="msgFontSize" value="small"><fmt:message key="form.common.small"/>
			</td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.msgColor"/></td>
			<td>
				<input type="text" name="msgColor" id="id_msgColor"/>
			</td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.msgBgEnabled"/></td>
			<td>
				<input type="checkbox" name="msgBgEnabled"/><fmt:message key="form.common.enable"/>
			</td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.msgBgColor"/></td>
			<td>
				<input type="text" name="msgBgColor" id="id_msgBgColor"/>
			</td>
		</tr>
	</table>
</div>
<%-- conference debug infomation  --%>
<div id="id_debug" style="display:none;margin: 5px;">
	<table border="0" cellpadding="5" cellspacing="1">
		<tr>
			<td><fmt:message key="form.confControl.members"/></td>
			<td><span id="id_members"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.speaker"/></td>
			<td><span id="id_speaker"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.pollers"/></td>
			<td><span id="id_pollers"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.audiomixers"/></td>
			<td><span id="id_audiomixers"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.speakers"/></td>
			<td><span id="id_speakers"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.screens"/></td>
			<td><span id="id_screens"></span></td>
		</tr>
		<tr>
			<td><fmt:message key="form.confControl.encoders"/></td>
			<td><span id="id_encoders"></span></td>
		</tr>
	</table>
</div>

<%-- following div is menu links container--%>
<div id="id_menu_ln" style="display:none;width:100%;height:100%;padding:10px;"
	<ul class="menu-links">
		<li><img src="<c:url value='/styles/default/images/user.png'/>" align="absbottom"/><a href="#" class="m-link" onclick="adminViewObj.active();"><fmt:message key="menu.manage.items.user" /></a></li>
		<li><img src="<c:url value='/styles/default/images/file.png'/>" align="absbottom"/><a href="#" class="m-link" onclick="confProfileViewObj.active();"><fmt:message key="menu.manage.items.conferenceProfile" /></a></li>
		<li><img src="<c:url value='/styles/default/images/event16.png'/>" align="absbottom"/><a href="#" class="m-link" onclick="confReserveViewObj.active();"><fmt:message key="menu.manage.items.conferenceReservation" /></a></li>
		<li><img src="<c:url value='/styles/default/images/callTable.png'/>" align="absbottom"/><a href="#" class="m-link" onclick="cdrViewObj.active();"><fmt:message key="menu.view.items.cdr" /></a></li>
		<li><img src="<c:url value='/styles/default/images/sysInfo.png'/>" align="absbottom"/><a href="#" class="m-link" onclick="openWin('<fmt:message key='mcu.statistic.title'/>', '<c:url value='/app/view/mcu/statistic'/>', 402, 580);"><fmt:message key="menu.view.items.systemInfo" /></a></li>
	</ul>
</div>

<%-- scheduler div --%>
<div id="id_scheduler" class="dhx_cal_container" style='width:100%; height:100%;display:none;'>
	<div class="dhx_cal_navline">
		<div class="dhx_cal_prev_button">&nbsp;</div>
		<div class="dhx_cal_next_button">&nbsp;</div>
		<div class="dhx_cal_today_button"></div>
		<div class="dhx_cal_date"></div>
		<div class="dhx_cal_tab" name="agenda_tab" style="right:280px;"></div>
		<div class="dhx_cal_tab" name="day_tab" style="right:204px;"></div>
		<div class="dhx_cal_tab" name="week_tab" style="right:140px;"></div>
		<div class="dhx_cal_tab" name="month_tab" style="right:76px;"></div>
	</div>
	<div class="dhx_cal_header">
	</div>
	<div class="dhx_cal_data">
	</div>		
</div>

<div id="cp_txt" style="position:absolute;z-index: 10;"></div>
<div id="cp_bg" style="position:absolute;z-index: 10;"></div>
</body>
</html>